<template>
	<yb-image
	:custom-id="customIdSync"
	:custom-style="rootStyle"
	:custom-class="customClassSync"
	:enablePreview="enablePreview"
	:borderRadius="size"
	:lazy-load="lazyLoad" :src="src" mode="aspectFill">
		<template v-slot:loading>
			<yb-text :size="18" value="头像"></yb-text>
		</template>
		<template v-slot:error>
			<yb-text :size="18" value="头像"></yb-text>
		</template>
	</yb-image>
</template>

<script>
	import ComponentMixin from '../../js_sdk/componentMixin.js'
	import Util from '../../js_sdk/util.js'
	export default {
		mixins: [ComponentMixin],
		props: {
			size: {
				type: [Number,String],
				default: 100
			},
			src: {
				type: String,
				default: ''
			},
			lazyLoad: {
				type: Boolean,
				default: false
			},
			enablePreview: {
				type: Boolean,
				default: false
			}
		},
		computed: {
			rootStyle () {
				return this.filterStyle(
					{
						width: Util.pixelunit(this.size),
						height: Util.pixelunit(this.size)
					}
				) + this.customStyleSync
			}
		}
	}
</script>

<style>
</style>
